<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><?php echo $this->title;?></title>
<link rel="stylesheet" href="<?php echo $this->baseUrl;?>/files/admin/css/main.css" />
<script language="javascript" src="<?php echo $this->baseUrl;?>/files/admin/js/jquery.js"></script>
<script language="javascript" src="<?php echo $this->baseUrl;?>/files/admin/js/load.js"></script>
<!--时间选择器-->
<script language="javascript" src="<?php echo $this->baseUrl;?>/files/admin/js/date/calendar.js"></script>
<script language="javascript" src="<?php echo $this->baseUrl;?>/files/admin/js/date/lang/cn_utf8.js"></script>
<script language="javascript" src="<?php echo $this->baseUrl;?>/files/admin/js/date/calendar-setup.js"></script>
<link rel="stylesheet" href="<?php echo $this->baseUrl;?>/files/admin/js/date/calendar-blue.css" />
<!--colorbox-->
<script language="javascript" src="<?php echo $this->baseUrl;?>/files/admin/js/colorbox.jquery/jquery.colorbox.js"></script>
<link href="<?php echo $this->baseUrl;?>/files/admin/js/colorbox.jquery/colorbox2.css" rel="stylesheet" type="text/css"/>
<!--bi-->
<link rel="stylesheet" href="<?php echo $this->baseUrl;?>/files/admin/css/bi.css" />
<script language="javascript" src="<?php echo $this->baseUrl;?>/files/admin/js/bi.js"></script>
<script language="javascript">
	function selCode(nu,pa){
		for(var i=1;i<=nu;i++){
			$("div#container"+i).hide();
			$("td#td"+i).removeClass("no_bottom_boder");
			$("td#td"+i).addClass("yes_boder");
		}
		$("div#container"+pa).show();
		$("td#td"+pa).removeClass();
		$("td#td"+pa).addClass("no_bottom_boder");
	}
</script>
<style>
.bi-body .bi-search-3{ height:70px;}
.bi-body .bi-search-3 .bi-s-center{height:48px;}
.bi-body .bi-search-3 .bi-s-center .bi-s-c-con{ height:26px;}
.bi-body .bi-search-3 .bi-s-center .bi-s-c-con .bi-s-c-sel td{ height:30px;}
</style>

</head>
<body style="overflow:auto;">
<div id="main" style="clear:both;">
		<div class="bi-body">
				<form id="searchForm" name="searchForm" method="post" action="<?php echo $this->projectUrl(array('action'=>'index'));?>" >
                    <div class="bi-search  bi-search-2">
                        <div class="bi-s-top"></div>
                        <div class="bi-s-center">
                            <div class="bi-s-c-con">
                                <div class="bi-s-c-sel">
                                    <table width="100%" border="0" cellspacing="0" cellpadding="0">
                                    <tr>
                                        <td colspan="5">
                                            <!-- 时间选择条 -->
                                            <div id="timeRange">
                                            
                                            <span>日期选择</span>：<input name="startTime" type="text" class="input" id="startTime" size="18" value="<?php echo $this->vars['startTime'];?>" /><script type="text/javascript">Calendar.setup({"ifFormat":"%Y-%m-%d","firstDay":0,"showsTime":true,"showOthers":false,"timeFormat":24,"inputField":"startTime","button":"startTime"});</script>
                                            -
                                            <input name="endTime" type="text" class="input" id="endTime" size="18" value="<?php echo $this->vars['endTime'];?>" />
                                            <script type="text/javascript">Calendar.setup({"ifFormat":"%Y-%m-%d","firstDay":0,"showsTime":true,"showOthers":false,"timeFormat":24,"inputField":"endTime","button":"endTime"});</script>
                                            </div>
                                            <!-- 时间选择条 -->
                                        </td>
                                        <td rowspan="3">
                                            <input name="search" type="submit" id="search" value="" class="s-button" />
                                        </td>
                                    </tr>
                
                                    <tr>
                                    <td colspan="5">
                                        地区选择：
                                        <select name="areas" id="areas" >
                                        <option value="">全国</option>
                                        <?php 
										foreach($this->memberRows as $row){
										?>
                                        <option value = "<?php echo $row["province"];?>" <?php if($this->vars["areas"]==$row["province"]) echo "selected='selected'"?>><?php if($row["province"] == "")echo "其他";else echo $row["province"];?></option>
                                        <?php } ?>
                                        </select>
                                    </td>
                                    </tr>
                
                                    <tr>
                                    <td>
                                        操作系统：
                                        <select name="osName" id="osName" size="1">
                                        <option value="">全部</option>
                                        <?php foreach($this->osNameRows as $key=>$row) {
											if($row["osName"] == "") $row["osName"] = "其他";
										?>
                                        	
                                        <option value = <?php echo $row["osName"];?> <?php if($this->vars["osName"]==$row["osName"]) echo "selected='selected'"?>>
										<?php if($row["osName"] == "")echo "其他";else echo $row["osName"];?>
                                        </option>
                                        <?php }?>
                                        </select>
                                    </td>
                                    <td >渠道：</td>
                                    <td >
                                        <div style="position: relative; width:130px;">
                                        <select  name="select" id="select" class="select-write" onchange="source.value=select.value;source.select()">
                                        <option value="">==选择==</option> 
                                        <?php foreach($this->channels as $val) { ?>  
                                        <option value="<?php echo $val["name"]; ?>" <?php if($this->vars["source"]==$val["name"]) echo "selected='selected'"?>><?php echo $val["name"]; ?></option>
                                        <?php } ?>
                                        </select>   
                                        <input type="text" class="text-write" name="source" id="source" value="<?php echo $this->vars['source'];?>"/>
                                        </div>
                                    </td>
                                    <td >SourceId ：</td>
                                    <td>
                                        <div style="position: relative; width:130px;" class="sourceId-con">
                                        <select name="select_sourceId" id="select_sourceId" class="select-write" onchange="sourceId.value=select_sourceId.value;sourceId.select()">
                                        <option value="">==选择==</option> 
                                        </select>
                                        <input type="text" class="text-write" name="sourceId" id="sourceId" value="<?php echo $this->vars['sourceId'];?>"/>
                                        <input type="hidden" name="default_sourceId" id="default_sourceId" value="<?php echo $this->vars['sourceId'];?>" />
                                        </div>
                                        <div class="sourceId-con-loading" style="width:130px;display:none;">加载中...</div>
                                    </td>
                                    </tr>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <div class="bi-s-bottom"></div>
                    </div>
                </form>
			
			
			
			<div class="clear" style="height:20px;"></div>
			<div class="bi-data">
				<div class="bi-d-top">
                <?php
					$row = "";
					$date = "";
					$boot = "";
					$bootNum = "";
					$olduser = "";
					$orderNum = "";
					$orderAmount = "";
					$alluser = $this->all['Alluser'];
					$totaluser = "";
					foreach ($this->rows as $key => $val){
						//echo "{$val['date']} = {$val['cnt']}<br/>";
						$row .= $val['cnt'] . ",";
						$boot .= $val["boot"] . ",";
						$bootNum .= $val["bootNum"] . ",";
						$orderNum .= $val["orderNum"] . ",";
						$orderAmount .= $val["orderAmount"] . ",";
						$olduser .= $val["boot"]-$val['cnt'] . ",";
						$alluser += $val['cnt'];
						$totaluser .= $alluser . ",";
						$date .= "\"" . $val['date'] . "\",";
					}
                ?>
					<div class="d-t-left">趋势分析</div>
					<div class="d-t-right"><span <?php if(count($this->rows)>0){?>class="show"<?php } else {?>class="hide"<?php }?> id="data_01" onclick="showData('01')" style="cursor:pointer;"></span></div>
				</div>
				<div class="bi-d-center  clear" id="data01">
					<div class="bi-d-center-bg">
					<!--content start-->


					<span class="d-line"></span>
					<div id="content" >
						<table width="710" border="0" cellspacing="0" cellpadding="0" style="margin-bottom:20px">
						  <tr>
						    <td height="25" colspan="9">&nbsp;</td>
					      </tr>
						  <tr>
							<td width="190" height="23" class="bottom_boder_one">&nbsp;</td>
							<td onclick="selCode(7,1)" id="td1" width="80" align="center" class="no_bottom_boder" style="cursor:pointer">新增用户</td>
							<td width="5" align="center" class="bottom_boder_one">&nbsp;</td>
							<td onclick="selCode(7,2)" id="td2" width="80" align="center" class="yes_boder" style="cursor:pointer">累计用户</td>
							<td width="5" align="center" class="bottom_boder_one">&nbsp;</td>
							<td onclick="selCode(7,3)" id="td3" width="80" align="center" class="yes_boder" style="cursor:pointer">启动用户</td>
							<td width="5" align="center" class="bottom_boder_one">&nbsp;</td>
							<td onclick="selCode(7,4)" id="td4" width="80" align="center" class="yes_boder" style="cursor:pointer">启动次数</td>
						    <td width="5" class="bottom_boder_one">&nbsp;</td>
                            <!--
							<td onclick="selCode(7,5)" id="td5" width="110" align="center" class="yes_boder" style="cursor:pointer">平均使用时长</td>
							<td width="5" align="center" class="bottom_boder_one">&nbsp;</td>
                            -->
							<td onclick="selCode(7,6)" id="td6" width="80" align="center" class="yes_boder" style="cursor:pointer">订单量</td>
							<td width="5" align="center" class="bottom_boder_one">&nbsp;</td>
							<td onclick="selCode(7,7)" id="td7" width="80" align="center" class="yes_boder" style="cursor:pointer">订单金额</td>
						    <td width="185" class="bottom_boder_one">&nbsp;</td>
						  </tr>

					  </table>

						<script type="text/javascript" src="<?php echo $this->baseUrl;?>/files/admin/js/highcharts/js/highcharts.js"></script>
						<script type="text/javascript" src="<?php echo $this->baseUrl;?>/files/admin/js/highcharts/js/modules/exporting.js"></script>
						<!-- 新用户 start -->
                        <script type="text/javascript">
                        var chart;
                        $(document).ready(function() {
                        chart = new Highcharts.Chart({
                         chart: {
                        renderTo: 'container',
                        defaultSeriesType: 'line',
                        marginRight: 35,
                        paddingBottom: 60
                        },
                        title: {
                        text: '每日新用户趋势',
                         x: -20 //center
                        },
                        subtitle: {
                         text: '',
                        x: -20
                        },
                        xAxis: {
                        type: 'date',
                        categories: [<?php echo $date; ?>],
                        size: 100,
                        labels: {
                        rotation: -70,
                        align: 'right'
                        }
                        },
                        yAxis: {
                        min: 0,
                        title: {
                        text: '新增用户数'
                        },
                        plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                        }]
                        },
                        tooltip: {
                        formatter: function() {
                        return '<b>'+ this.series.name +'</b><br/>'+
                        this.x +': '+ this.y;
                        }
                        },
                        legend: {
                        layout: 'horizontal',
                        align: 'center',
                        verticalAlign: 'bottom',
                        x: 10,
                        y: 10,
                        borderWidth: 0
                        },
                        series: [{
                        name: '每日新增安装量趋势',
                        data: [<?php echo $row; ?>]
                        }]
                        });
                        });
                        </script>
                        <div id="container1" class="bitemcon" style="padding-bottom: 30px; display: block; ">
                        <div id="container" style="width: 600px; height: 400px; margin: 0 auto"> </div> 
                         </div>
                         <!-- 新用户 end -->
                         
                        <!-- 累计用户 start--> 
                        <script type="text/javascript">
                        var chart;
                        $(document).ready(function() {
                        chart = new Highcharts.Chart({
                        chart: {
                        renderTo: 'total',
                        defaultSeriesType: 'column',
                        marginRight: 35,
                        marginBottom: 120
                        },
                        title: {
                        text: '累计用户',
                        x: -20 //center
                        },
                        subtitle: {
                        text: '',
                        x: -20
                        },
                        xAxis: {
                        type: 'date',
                        categories: [<?php echo $date; ?>],
                        size: 100,
                        labels: {
                        rotation: -70,
                        align: 'right'
                        }
                        },
                        yAxis: {
                        min: 0,
                        title: {
                        text: '累计用户数'
                        },
                        plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                        }]
                        },
                        tooltip: {
                        formatter: function() {
                        return '<b>'+ this.series.name +'</b><br/>'+
                        this.x +': '+ this.y;
                        }
                        },
                        legend: {
                            layout: 'horizontal',
                            align: 'center',
                            verticalAlign: 'bottom',
                            x: 10,
                            y: 10,
                            borderWidth: 0
                            },
                        series: [{
                        name: '累计用户',
                        data: [<?php echo $totaluser; ?>]
                        }]
                        });
                        });
                        </script>   
                        <div id="container2" class="bitemcon" style="padding-bottom: 30px; display: none; ">
                            <div id="total" style="width: 600px; height: 400px; margin: 0 auto"> </div> 
                        </div>
                        <!-- 累计用户 end--> 
                        
                        <!-- 启动用户 start--> 
                        <script type="text/javascript">
                        var chart;
                        $(document).ready(function() {
                        chart = new Highcharts.Chart({
                        chart: {
                        renderTo: 'boot',
                        defaultSeriesType: 'column',
                        marginRight: 35,
                        paddingBottom: 120
                        },
                        title: {
                        text: '启动用户',
                        x: -20 //center
                        },
                        subtitle: {
                        text: '',
                        x: -20
                        },
                        xAxis: {
                        type: 'date',
                        categories: [<?php echo $date; ?>],
                        size: 100,
                        labels: {
                        rotation: -70,
                        align: 'right'
                        }
                        },
                        yAxis: {
                        min: 0,
                        title: {
                        text: '启动用户数'
                        },
                        plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                        }]
                        },
                        tooltip: {
                        formatter: function() {
                        return '<b>'+ this.series.name +'</b><br/>'+
                        this.x +': '+ this.y;
                        }
                        },
                        credits: {"enabled":false},
                        plotOptions: {"column":{"stacking":"normal"}},
                        legend: {
                            layout: 'horizontal',
                            align: 'center',
                            verticalAlign: 'bottom',
                            x: 10,
                            y: 10,
                            borderWidth: 0
                            },
                        series: [{
	                        name: '新用户',
	                        data: [<?php echo $row; ?>]
                        },{
                            name: '老用户',
                            data: [<?php echo $olduser; ?>]
                        }
                        ]
                        });
                        });
                        </script>   
                        <div id="container3" class="bitemcon" style="padding-bottom: 30px; display: none; ">
                            <div id="boot" style="width: 600px; height: 400px; margin: 0 auto"> </div> 
                        </div>
                        <!-- 启动用户 end--> 
                        
                        <!-- 启动次数 start-->
                        <script type="text/javascript">
                        var chart;
                        $(document).ready(function() {
                        chart = new Highcharts.Chart({
                        chart: {
                        renderTo: 'bootnum',
                        defaultSeriesType: 'line',
                        marginRight: 35,
                        marginBottom: 120
                        },
                        title: {
                        text: '启动次数',
                        x: -20 //center
                        },
                        subtitle: {
                        text: '',
                        x: -20
                        },
                        xAxis: {
                        type: 'date',
                        categories: [<?php echo $date; ?>],
                        size: 100,
                        labels: {
                        rotation: -70,
                        align: 'right'
                        }
                        },
                        yAxis: {
                        min: 0,
                        title: {
                        text: '启动次数'
                        },
                        plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                        }]
                        },
                        tooltip: {
                        formatter: function() {
                        return '<b>'+ this.series.name +'</b><br/>'+
                        this.x +': '+ this.y;
                        }
                        },
                        legend: {
                            layout: 'horizontal',
                            align: 'center',
                            verticalAlign: 'bottom',
                            x: 10,
                            y: 10,
                            borderWidth: 0
                            },
                        series: [{
                        name: '启动次数',
                        data: [<?php echo $bootNum; ?>]
                        }]
                        });
                        });
                        </script>   
                        <div id="container4" class="bitemcon" style="padding-bottom: 30px; display: none; ">
                            <div id="bootnum" style="width: 600px; height: 400px; margin: 0 auto"> </div> 
                        </div>
                        <!-- 启动次数 end-->
                        
                        <!-- 时长 start-->
                        <script type="text/javascript">
                        var chart;
                        $(document).ready(function() {
                        chart = new Highcharts.Chart({
                        chart: {
                        renderTo: 'time',
                        defaultSeriesType: 'line',
                        marginRight: 35,
                        marginBottom: 120
                        },
                        title: {
                        text: '平均使用时长（秒）',
                        x: -20 //center
                        },
                        subtitle: {
                        text: '',
                        x: -20
                        },
                        xAxis: {
                        type: 'date',
                        categories: [<?php echo $date; ?>],
                        size: 100,
                        labels: {
                        rotation: -70,
                        align: 'right'
                        }
                        },
                        yAxis: {
                        min: 0,
                        title: {
                        text: '平均使用时长'
                        },
                        plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                        }]
                        },
                        tooltip: {
                        formatter: function() {
                        return '<b>'+ this.series.name +'</b><br/>'+
                        this.x +': '+ this.y;
                        }
                        },
                        legend: {
                            layout: 'horizontal',
                            align: 'center',
                            verticalAlign: 'bottom',
                            x: 10,
                            y: 10,
                            borderWidth: 0
                            },
                        series: [{
                        name: '平均使用时长',
                        data: [<?php echo $row; ?>]
                        }]
                        });
                        });
                        </script>   
                        <div id="container5" class="bitemcon" style="padding-bottom: 30px; display: none; ">
                            <div id="time" style="width: 600px; height: 400px; margin: 0 auto"> </div> 
                        </div>
                        <!-- 时长 end-->
                        
                        <!-- 订单量 start-->
                        <script type="text/javascript">
                        var chart;
                        $(document).ready(function() {
                        chart = new Highcharts.Chart({
                        chart: {
                        renderTo: 'orderno',
                        defaultSeriesType: 'line',
                        marginRight: 35,
                        marginBottom: 120
                        },
                        title: {
                        text: '订单量',
                        x: -20 //center
                        },
                        subtitle: {
                        text: '',
                        x: -20
                        },
                        xAxis: {
                        type: 'date',
                        categories: [<?php echo $date; ?>],
                        size: 100,
                        labels: {
                        rotation: -70,
                        align: 'right'
                        }
                        },
                        yAxis: {
                        min: 0,
                        title: {
                        text: '订单量'
                        },
                        plotLines: [{
                        value: 0,
                        width: 1,
						verticalAlign: 'bottom',
                        color: '#808080'
                        }]
                        },
                        tooltip: {
                        formatter: function() {
                        return '<b>'+ this.series.name +'</b><br/>'+
                        this.x +': '+ this.y;
                        }
                        },
                        legend: {
                            layout: 'horizontal',
                            align: 'center',
                            verticalAlign: 'bottom',
                            x: 10,
                            y: 10,
                            borderWidth: 0
                            },
                        series: [{
                        name: '订单量',
                        data: [<?php echo $orderNum; ?>]
                        }]
                        });
                        });
                        </script>
                        <div id="container6" class="bitemcon" style="padding-bottom: 30px; display: none; ">
                            <div id="orderno" style="width: 600px; height: 400px; margin: 0 auto"> </div> 
                        </div> 
                        <!-- 订单量 end-->  
                        
                        <!-- 订单金额 start-->
                        <script type="text/javascript">
                        var chart;
                        $(document).ready(function() {
                        chart = new Highcharts.Chart({
                        chart: {
                        renderTo: 'amount',
                        defaultSeriesType: 'line',

                        },
                        title: {
                        text: '订单金额'
                        },
                        subtitle: {
                        text: '',
                        x: -20
                        },
                        xAxis: {
                        type: 'date',
                        categories: [<?php echo $date; ?>],
                        size: 100,
                        labels: {
                        rotation: -70,
                        align: 'right'
                        }
                        },
                        yAxis: {
                        min: 0,
                        title: {
                        text: '订单金额(元)'
                        },
                        plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                        }]
                        },
                        tooltip: {
                        formatter: function() {
                        return '<b>'+ this.series.name +'</b><br/>'+
                        this.x +': '+ this.y;
                        }
                        },
                        legend: {
                            layout: 'horizontal',
                            align: 'center',
                            verticalAlign: 'bottom',
                            x: 10,
                            y: 10,
                            borderWidth: 0
                            },
                        series: [{
                        name: '订单金额',
                        data: [<?php echo $orderAmount; ?>]
                        }]
                        });
                        });
                        </script>                     
                        <div id="container7" class="bitemcon" style="padding-bottom: 30px; display: none; ">
                            <div id="amount" style="width: 600px; height: 400px; margin: 0 auto"> </div> 
                        </div>
                        <!-- 订单金额 end-->
						
					</div>
					<span class="d-line"></span>
					
					<!--content end-->
					</div>
				</div>
				<div class="bi-d-bottom"></div>
			</div>
			
			
			
			
			
			
		</div>
	
</div>

<script language="javascript">
function selData(action,dateType,doType){
    $('#searchForm').attr('action', action);
	$('#dateType').attr('value', dateType);
	$('#doType').attr('value', doType);
    $('#searchForm').submit();
}


<!-- 更新渠道时，更新sourceId start-->
$(function(){
	$("#select").change(function(){
	if($.trim($("#source").val())!=''){
		$(".sourceId-con").hide();
		$(".sourceId-con-loading").show();
		$("#sourceId").attr('value','');
		var self=$("#select_sourceId")[0];
			 $.ajax({ url: "<?php echo $this->projectUrl(array('controller'=>'base-data-count','action'=>'sourceids'));?>",
				 type:"post",           
				 dataType:"json",
				 data: "source="+$("#source").val(),
				 success:function(data){ 
						self.options.length=0;
						self.options[0] = new Option('==选择==', '');
						var default_val=$("#default_sourceId").val();
						$.each(data,function(i){
							self.options[i+1] = new Option(data[i], data[i]);
							if(default_val==data[i]) {										 
								self.options[i+1].selected=true;																					
							} 
						}); 
						$(".sourceId-con").show();
						$(".sourceId-con-loading").hide();					
				 } 
			 });
		}	
	})
	if($.trim($("#source").val())!=''){
		$("#sourceId").attr('value','');
	}
})
<!-- 更新渠道时，更新sourceId  end-->

</script>
</body>
</html>